@charset "utf-8";
/* CSS Document */

html
{width:99%;}

body{
overflow-x: hidden;
background-color:#efefef;
margin-left: 0px;
margin-top:0px;
font-size: 16px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
height:100%;
-ms-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}

img{
width: 100%;
height: auto;
}

iframe{
width: 560px;
height: 317px;
}


img.small{
width: 47%;
height: auto;
}


main {
position:relative;
top:5px; 
left: 26px;
display: flex;
flex-wrap: row;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-size:16px;
font-style: thin;
line-height: 1.4;
width:100%;  
height:100%;
}


figure{
position:absolute;
left:57px;
top: 380px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;  
height:50px;
width:500px;
}


nav{
position:absolute;
left:54px;
top: 71px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:500px;  
height:600px;
}

ul, li {
margin-top:0px;
display:block;
margin:3px;
list-style-type:none;
margin-bottom:0px;
}

li#writings {
list-style: square;
}

a.main{
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
font-size:18px;
text-decoration:none;
color:#000;
}

a.main:link {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
font-size:18px;
color:#000;
}

a.main:visited {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
color:#000; }

a.main:hover {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
color:#ffffff;
background-color:#800040;
text-decoration:none;
font-size:18px;
}

.navi_active {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
color:#fff;
text-decoration: underline overline;
background-color:#800040;
text-decoration:none;
font-size:18px;
}


h1{
font-size: 36px;
line-height: 1.2;
font-weight:300;
color:#000;
}

h3{
font-size: 36px;
line-height: 1.2;
font-weight:300;
color:#000;
}

h4{
font-size: 18px;
line-height: 1.2;
font-weight:300;
color:#000;
}

section#linie{
background-color:#999;
position:absolute;
left:99px;
top: 355px;
width:960px;  
height:1px;
}

article{
position:absolute;
left:440px;
top:170px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;eft
line-height: 1.4;
width:620px;  
height:300px;
}

article#pict {
position:absolute;
left:440px;
top:69px;
text-align:left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;eft
line-height: 1.4;
width:620px;  
height:300px;
}

div#text_intend {
padding:4%;
}

section#pictures {
position:absolute;
left:440px;
top: 391px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:600px;  
height:100%;
}

section#pictures_down {
position:absolute;
left:440px;
top: 390px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:600px;  
height:100%;
}

section#pictures_down_2 {
position:absolute;
left:440px;
top: 390px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:600px;  
height:100%;
}

section#submenu{
z-index:12;
position:relative;
left:0px;
top: -20px;
text-align:left;
}

a{
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
font-size:18px;
text-decoration:none;
color:#000;
}

a:link {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
font-size:18px;
color:#000;
}

a:visited {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
color:#000; }

a:hover {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
color:#ffffff;
background-color:#800040;
text-decoration:none;
font-size:18px;
}

a.textlink:link {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
font-size:15px;
color:#000;
}

a.textlink:visited {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
font-size:15px;
color:#000; }


a.textlink:hover {
font-family: "Roboto", sans-serif;
font-weight: 200;
font-style: thin;
text-decoration:none;
color:#ffffff;
background-color:#800040;
text-decoration:none;
font-size:15px;
}


.blink {
text-decoration:none;
color:#ffff00;
background-color:#000;
    animation-name: animation_blink;
    animation-timing-function: ease-in;
    animation-duration: 3s; 
    animation-iteration-count: infinite;            
}

@keyframes animation_blink {
    50% { opacity: 0.07; }
    100% { opacity: 1; } 
    0% { opacity: 1; }
   
}




@media all and (max-width:600px) {

body{

overflow-x: hidden!important; 
margin:0px;
background-color:#efefef;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;  
height:100%;
width:100%;
-ms-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
}


main{
overflow-x: hidden!important; 
position:absolute;
left:-10px;
margin: 3px auto;
width: 96%;
height: 96%;
box-sizing: border-box;
padding: 0px;
border: 0px;
line-height: 1.4em;
}

figure{
visibility: collapse;
}


ul, li {
width:80%;
position:relative;
top:13px;
display:block;
margin:3px;
list-style-type:none;
}


nav{
z-index:10;
position:absolute;
left:-3px;
top:10px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;  
height:45%;
320px;
// flex-basis: 350px; 
// flex: 4;
}


a.main{
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
font-size:18px;
line-height: 1.2;
text-decoration:none;
color:#000;

}

a.main:link {
text-decoration:none;
font-size:18px;
line-height: 1.3;
color:#000;
}

a.main:visited {
text-decoration:none;
font-size:18px;
line-height: 1.3;
color:#000; 
}

a.main:hover {
font-size:18px;
line-height:1.3;
color:#FFFFFF;
text-decoration:none;
background-color:#800040;
}

section#linie{
visibility: collapse;
visibility: none;
}

article{
position:absolute;
left:20px;
top:313px;
text-align:left;
margin:20px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
font-size:16px;
line-height: 1.4;
width:88%;  
height:300px;
}

section#pictures{ 
position:absolute;
left:35px;
top: 235px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:88%;  
height:100%;
}

section#pictures_down { 
position:absolute;
left:35px;
top: 235px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:88%;  
height:100%;
}

section#pictures_down_2 { 
position:absolute;
left:35px;
top: 140px;
text-align:left;
margin-left:0px;
margin-top:0px;
font-family: "Roboto", sans-serif;
font-weight: 100;
font-style: thin;
line-height: 1.4;
width:88%;  
height:100%;
}


img{
width: 98%;
height: auto;
}

img.small{
width: 42%;
height: auto;
}

iframe{
z-index:15;
width: 100%;
height: 50.2%;
}

h3{
font-size: 24px;
line-height: 1.2;
font-weight:300;
color:#000;
}

h4{
font-size: 16px;
line-height: 1.2;
font-weight:300;
color:#000;
}

h5{
font-size: 16px;
line-height: 1.2;
font-weight:100;
color:#000;
}


article {
visibility: collapse;
visibility: none;
}

article#pict {
visibility: collapse;
visibility: none;
}

h1{
visibility: collapse;
visibility: none;
}
}