@charset "utf-8";
/*import norm.css*/
@import url("norm.css");

html	{
height: 101%;	
}

/*Back to top button*/
#back-top {
	position: fixed;
	bottom: 10%;
	right: 1%;
}

#back-top a {opacity: 0.9;
	display: block;
	text-align: center;
	text-decoration: none;
	
	color: #bbb;
	/* background color transition */
}

#back-top a:hover {
opacity: 1.0;
}
/* arrow icon (span tag) */
#back-top span {border: none;
	width: 60px;
	height: 37px;
	display: block;
	background:  transparent url(../bilder/arrow-up.png) no-repeat center center;
	/* background color transition */
}

#content {
 width: 100%;
    display: -webkit-flex; /* Safari */
    display: flex;
}

#content div {
background: #f6f8fd; padding: 0.5em;
    -webkit-flex: 1;  /* Safari 6.1+ */
    -ms-flex: 1;  /* IE 10 */    
    flex: 1;
		margin: 0% 1.6% 0% 1.6%;
}

#top-wide	{
border-top: 10px solid #e1e8f8;
background-image: linear-gradient(to left, #0E79C9 45%, white 100%);padding: 1em 0 1em 0;
border-bottom: 10px solid #e1e8f8;
}

#top	{
text-align: right;
width: 100%;
color: #fff;
}

#top img	{
margin-top: -27.5em;
}

hr	{
border-top: 1px solid #708090;
border-bottom: 0;
}

h1	{
letter-spacing: 0.05em;
font-style: italic;
text-shadow: #fff 3px 1px 1px;
position: relative;
z-index: 100;
color: #708090;
text-align: left;
font-size: 2.7em;
}

h1 a	{
color: #708090;
}

h1 a:hover{
color: #708090;	
}

h2  {
font-style: italic;
     font-size: 1.7em; /* 36px; */
    line-height: 1.0em; /* 54px */
	font-weight: normal;
}

h2.small  {
font-style: italic;
     font-size: 1.5em; /* 36px; */
    line-height: 1.0em; /* 54px */
	font-weight: normal;
}

h3	{line-height: 0;
padding-top: 5px;
font-style: italic;
font-size: 1.2em;
font-weight: 600;
}
.post	{
font-size: 90%;
}

p	{font-size: 19px;
font-weight: 400;
text-align: justify;
-ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}
p strong	{
font-weight: 400;	
font-size: 22px;	
}

p.smaller	{
	line-height: 1.1;
font-size: 18px;
font-weight: 400;
text-align: justify;
-ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}

p.small	{
font-size: 0.8em;
}

p.img	{
text-align: justify;
font-size: 18px;
}

p.left	{
text-align: left;
}

p.bottom	{
font-size: 19px;
margin-top: -2em;
}

p span	{
position: relative;
left: 0.2em;
top: 0.1em;
font-size: 2.5em;
font-weight: 300;
}

#footer p.reframe	{
	color: #fff;
	font-size: 20px;
}
.fa	{
text-align: center;
width: 1.0em;
height: 1.0em;
margin-left: -1.2em;
margin-top: 0.5em;
padding: 0.2em;
margin-right: 1.0em;
background: #0e79c9;
border: 4px solid #fff;
}

#content p	{
padding: 0 1em;
font-size: 18px;
-ms-hyphens: auto;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}
a	{
padding-left:0.5em;
outline: none;
text-decoration: none;
color: #08436d;
}

a:hover	{
color: #0c6bb1;
-o-transition:color .2s ease-out;
-ms-transition:color .2s ease-out;
-moz-transition:color .2s ease-out;
-webkit-transition:color .2s ease-out;
/* ...and now override with proper CSS property */
transition:color .2s ease-out;
}

#footer p a:hover	{
color: #fff;
-o-transition:color .2s ease-out;
-ms-transition:color .2s ease-out;
-moz-transition:color .2s ease-out;
-webkit-transition:color .2s ease-out;
/* ...and now override with proper CSS property */
transition:color .2s ease-out;
}
	
body {
background: #fff;
margin: 0 auto; 
padding: 0; 
color: #708090; 
font-size: 1.2em; 
font-family: 'Source Sans Pro', sans-serif;
}

img {
max-width: 100%; 
height: auto;
}

ul#mainmenu { border-bottom:1px solid #708090;
margin-top: -30px;
list-style-type: none;
}

ul#mainmenu li  {	font-variant: small-caps; 
border-radius: 20px 0 20px 0;
background-image: linear-gradient(to top, #ccd8f3 25%, white  100%);
border-top: 2px solid #fff;
border-bottom: 2px solid #708090;
display:inline; 
padding: 10px 25px 10px 20px; 
text-decoration: none; 
color: #08436d;
}	
ul#mainmenu li a { 
text-decoration: none;
color: #08436d;
}

ul#mainmenu li a:hover{ 
color: #128ce3;
-o-transition:color .2s ease-out;
-ms-transition:color .2s ease-out;
-moz-transition:color .2s ease-out;
-webkit-transition:color .2s ease-out;
/* ...and now override with proper CSS property */
transition:color .2s ease-out;
}  
ul#mainmenu ul li { 
background: none; margin-top: 0; display: inline; margin-bottom: 1px;
}

#info,#info2, #info3 {
border: 1px solid #CCD8F3;
}
   
#footer { 
background: linear-gradient(to right, #5687d0 45%, white  100%);
color:#f1f1f1; 
padding: 10px 0 60px; 
text-align: center; 
font-weight: normal; 
cursor: pointer ;
border-top: 1px solid #8d9aa6;
}

#footer p	{font-size: 16px;
text-align: center;
}
@media only screen and (max-width: 1400px) {
#top img	{
margin-top: -6.5em;
padding-right: 1em;
}
}

@media only screen and (max-width: 768px)	{
#info,#info2, #info3 {
margin-top: 0em;
padding: 1em 3em;
min-height: auto;
}
#content	{
margin-top: -1em;
padding: 0em;
display: block;
}
#content div {
    -webkit-flex: none;  /* Safari 6.1+ */
    -ms-flex: none;  /* IE 10 */    
    flex: none;
		margin: 5% 0%;
}
#content p	{
text-align: left;
}
h1	{
padding-left: 1.5em;
font-size: 2.3em;
}
ul#mainmenu { border-bottom:1px solid #38a4f0;
margin-top: -30px;
}
ul#mainmenu li  { 
display:inline; padding: 10px 10px 10px 10px; text-decoration: none; color: #08436d;
}
#top img	{
margin-top: -5.5em;
}
}

@media only screen and (max-width: 600px) {
ul#mainmenu li  { 
border-radius: 0;
display:block; padding: 10px 20px 10px 10px;
}
ul#mainmenu	{
padding: 0;
margin-top: -2em;
}
h1	{
padding: 0em;
font-size: 1.5em;
}
}

