/*----------------------------*\
	links
\*----------------------------*/
#links
{
position: fixed;
top: 20px;
left: 0%;
height: 90%;
width: 300px;
padding-left: 5px;
background-color: rgb(246, 236, 216);
float: left;
z-index: 1;
overflow-y: scroll;
text-align: left;
font-size: 100%;
}
/*----------------------------*\
	mitte
\*----------------------------*/
#mitte
{
position: absolute;
top: 20px;
left: 310px;
right: 290px;
width: auto;
height: 90%;
overflow-y: auto;
z-index: 1;
text-align: left;
background-color: rgb(246, 236, 216);
}
/*----------------------------*\
	rechts
\*----------------------------*/
#rechts
{
position: fixed;
top: 20px;
right: 0%;
height: 90%;
width: 280px;
padding-right: 5px;
background-color: rgb(246, 236, 216);
float: right;
overflow-y: scroll;
z-index: 1;
text-align: left;
}

#footer {
    position: fixed;
    height: auto;
    background-color: rgb(246, 236, 216);
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin-bottom: 0px;
}

/*----------------------------*\
	Top header
\*----------------------------*/
#top-header {
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #1E1F29;
}

.header-links li {
  display: inline-block;
  margin-right: 15px;
  font-size: 12px;
}

.header-links li:last-child {
  margin-right: 0px;
}

.header-links li a {
  color: #FFF;
}

.header-links li a:hover {
  color: #009bc4;

}

.header-links li i {
  color: #009bc4;
  margin-right: 5px;
}

#header {
  padding-top: 15px;
  padding-bottom: 15px;
  background-image:  linear-gradient(-135deg, #FF6CAB 0%, #F660BC 10%, #EC53CD 20%, #E045DE 30%, #D335EE 40%, #C323FF 50%, #B53AFF 60%, #A749FF 70%, #9854FF 80%, #865EFF 90%, #7366FF 100%);
}

.header-logo {
  float: left;
}

.header-logo .logo img {
  display: block;
}

/*=========================================================
	03 -> Navigation
===========================================================*/

#navigation {
  background: #FFF;
  border-bottom: 2px solid #E4E7ED;
}

/*=========================================================*/

body {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    font-size: 100%;
}



p {
    max-width: 1000px;
}

img {
  width: 100%;
  max-width: 300px; 
  height: auto;
}

@media screen and (max-width: 1125px) {
  html, body {
    font-size: 102%;
  }    
}

@media screen and (max-width: 1115px) {
  html, body {
    font-size: 105%;
  }
}

@media screen and (max-width: 750px) {
  #content_wrap {
    flex-direction: column;
  }
  #content_wrap main {
    order: 1;
    width: 100%;
  }
  #content_wrap aside {
    width: 100%;
  }
  #content_wrap #sidebar_1 {
    border-bottom: 0.065em solid #bbb;
  } 
} 
