@import url('https://fonts.googleapis.com/css?family=Oswald&display=swap');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap');


body {font-family: 'Source Sans Pro', sans-serif; line-height: 1.4; margin:0px; padding:0px; font-size: 16px; color: #000; }

header {height: 360px;z-index: 10;}
.header-banner {background-image: url('img/header-ki-consulting.jpg'); background-position: center; background-repeat: no-repeat; background-size: cover; width: 100%; height: 300px; position: relative;}

header .header-container {position: absolute; bottom: 2rem; left: 2rem;}
header h1 {font-family: 'Source Sans Pro', cursive; font-size: 3em; font-weight: bold; color: #fff; text-transform: uppercase; margin: 0px;}
header span {font-size: 2.8em; color: #fff; text-transform: uppercase; margin: 0px; margin: -20px 0px 0px 0px; display: block;}
.fixed-header {position: fixed; top: 0; left: 0; width: 100%;}

nav {width: 100%; height: 60px; background: #292f36; postion: fixed; z-index: 10;}

nav div {color: white; font-size: 2rem; line-height: 60px; position: absolute; top: 0; left: 2%; visibility: hidden;}
.visible-title {visibility: visible;}

nav div.site-title {font-family: 'Source Sans Pro', cursive; font-weight: normal; margin-left: 2rem;}

nav ul {list-style-type: none; margin: 0 2rem auto 0; padding-left: 0; text-align: right; max-width: 100%;}
nav ul li {display: inline-block; line-height: 60px; margin-left: 10px;}
nav ul li a {text-decoration: none; color: #a9abae; font-size: 16px;}

a {color: #195c8e; text-decoration: none;}

h2 {font-size: 18px; text-transform: uppercase; font-weight: bold; color: #006993; margin-bottom: 0px;}
span.author {display: block; font-size: 18px; text-align: center; color: #006993; margin-bottom: 80px;}


.footer {width: 100%; height: 60px; background: #ededed; postion: fixed; z-index: 10; text-align: center; line-height: 60px;}

ul.breadcrumb {list-style: none; padding: 30px 0; margin: 0px; max-width: 1000px; border-bottom: 1px solid #ededed;}
ul.breadcrumb li {display: inline;font-size: 14px;}
ul.breadcrumb li+li:before {padding: 8px;color: black;content: ">";}
ul.breadcrumb li a {color: #0275d8;text-decoration: none;}
ul.breadcrumb li a:hover {color: #01447e;text-decoration: underline;}

.content {margin: 0 auto; padding: 4rem 0; max-width: 100%;}

.impressum {padding: 0 4rem;}
.impressum .content-inner {margin: 0 auto; max-width: 1000px; padding: 0 4rem 4rem 4rem; background-color: #fff;}
article {float: left; width: 60%; background: rgb(0,13,29); background: linear-gradient(90deg, rgba(0,13,29,1) 0%, rgba(3,117,151,1) 100%); padding: 30px;}
article div.article-container {float: right; margin-right: 10%;}
article h3, article ul {font-size: 18px; font-weight: bold; color: #fff; margin-top: 0px;}
article ul {list-style-type: none; margin: 0; padding: 0;}
aside {float: left; width: 30%; padding: 6px 0px 0px 30px;}
aside p.kontakt {font-size: 14px; font-weight: bold;}
aside p.upper {text-transform: uppercase;}

a.button {font-size: 16px; margin-top: 30px; display: inline-block; background-color: #195c8e; color: #ffffff; padding: 10px 14px; border-radius: 2px; transition: background-color 0.5s ease;}
a.button:hover {background-color: #114260;}


@media only screen and (max-width: 960px) {
  nav div.site-title {left: 0; margin-left: 25px; font-size: 1.6rem;}
  header h1 {font-size: 2em;}
  header span {font-size: 1.85em; margin: -10px 0px 0px 0px;}
    .content {display: block; width: 100%; padding: 0px;}
    .impressum {padding: 0px;}
    article {float: none; margin: 0 auto; width: auto;}
    article div.article-container {float: left; margin-right: 0%;}
    article:last-of-type {margin-bottom: 3rem;}
    aside {float: none; text-align: left; width: auto;}
    .content h2 {padding: 30px 30px 0px 30px;}
    .content span {padding: 0px 30px;}
}