/* 
    Created on : Jan 22, 2018, 9:01:28 AM
    Author     : tumbler
*/


.color-project-grey {
    color: #999999;
}


.color-project-pink {
    color: rgb(160,14,139);
    color: #a40e8b
}


.color-project-green {
    color:rgb(61,162,61);
    color: #3DA23D
}


main {    
    width:100%;    
}





header {    
    width:100%;
    margin:.5em 0 .5em 0;
}




header > div:nth-of-type(1) {
    display:flex;
    width:100%;    
    justify-content: flex-start;
}


header > div:nth-of-type(1) > div:nth-of-type(1) { 
    display:flex;
    justify-content: flex-start;
    align-items:center;    
}
header > div:nth-of-type(1) > div:nth-of-type(2) {    
    display:flex;    
    align-items: center;
    justify-content: flex-start;
    font-family: 'kim-1';    
}
header > div:nth-of-type(1) > div:nth-of-type(3) {    
    display:flex;    
    align-items: flex-end;
    padding: 0 1em 0.2em 1em;
    font-family: 'font-std-3';
    font-style:italic;
    font-weight:bold;    
}

header > div:nth-of-type(2) {
    text-align:center;    
}



.spacer-header {
    width:100%; 
    display:flex;
    flex-direction: column;
}

.spacer-header > div:nth-of-type(1) {
    border-bottom: #3DA23D solid 1px; 
    width:75%;
    height:0;
}
.spacer-header > div:nth-of-type(2) {
    display:flex;
    width:100%;
    padding: .3em 0 .4em 0;    
}
.spacer-header > div:nth-of-type(2) > div:nth-of-type(1) {
    width:2%;
}
.spacer-header > div:nth-of-type(2) > div:nth-of-type(2) {
    width:95%;
    display:flex;
    justify-content: center;
    align-items: center;
    padding:0 1em 0 1em;
}

.spacer-header > div:nth-of-type(2) > div:nth-of-type(3) {
   width:2%;
}

.spacer-header > div:nth-of-type(3) {
    width:75%;
    align-self: flex-end;
    border-top: #3DA23D solid 1px;
    height:0;
}




nav.navigation-mobil {
    position:fixed;
    z-index:2200000;
    top:0em;
    right:0em;
    font-size:2.1rem;
    display:none;
    justify-content: flex-end;
    align-items:center;
}

nav.navigation-mobil > i {
    /*padding: 0.2em 0.1em 0 0;*/
}

nav.navigation-mobil:hover {
    cursor:pointer;
}

nav.navigation-mobil > div {
    position:absolute;
    z-index:2200000;
    top:50px;
    background-color: rgba(255,255,255,1);
    box-shadow: 0px 0px 20px 10px #fff;    
    padding: 0 0.5em 0 0.5em;
    font-size:1.7rem;
    width:230px;
}

nav.navigation-mobil > div .icon-scissors::before, nav.navigation-mobil > div .icon-scissors-after::after {
    font-size:0.7em !important;  
    vertical-align: middle;    
}

.navigation-small {
    right:-230px;
}

.navigation-big {
    right:0px;
    transition: right 500ms;
}

nav.navigation-mobil > div > div {
    display: flex;
    justify-content: flex-start;
    align-items: center;    
    border-bottom: 1px dotted #ccc;
}








main {
     margin: 2em 0 0 0;
}


.backlink {
    margin: 2em auto 3em auto;
    width:100%;
    text-align:center;
}





footer {    
    width:100%;    
    display:flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(160,14,139, 0.85);
    position:fixed;
    left:0;
    bottom:0;
    z-index:20000;
    color: #fff;
    padding:.1em 0 .1em 0;
}

footer:hover {
    background-color: rgba(160,14,139, 1);
    transition: background-color 500ms;
}

footer a:link, footer a:visited {
    color: #fff;
    font-family: 'font-std-1';
    font-size: 0.85em;
    display:block;
    padding:.1em;
}

footer a:hover, footer a:focus, footer a:active {
   color: #63e630
}



.is-open > p {
    margin:0;
    text-align:center;
}




@media screen and (max-width: 360px) {
    body { font-size:13px}
    nav.navigation-mobil {
        display:flex;        
    }
    
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 70px;
        padding:0 1.5em 0 0.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: auto;
        font-size:1.9em;
        letter-spacing: 2px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 0%;
        display:none;
        font-size:0em;        
    }
    header > div:nth-of-type(2) {
        margin: 0.5em 1em 0 1em;
        font-size:1em;
    }
    .is-open {        
        font-size:0.9em !important;
    }
}

@media screen and (min-width: 361px) and (max-width: 480px) {
    body { font-size:14px; }
    nav.navigation-mobil {
        display:flex;        
    }
   
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 50px;
        padding:0 0.5em 0 .5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: auto;
        font-size:2.2em;
        letter-spacing: 2px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 0%;
        font-size:0;        
        display:none;
    }
    header > div:nth-of-type(2) {
        margin: 0.5em 1em 1em 1em;
        font-size:1em;
    }
    .is-open {        
        font-size:0.9em !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 640px) {
    body { font-size:14px; }
    nav.navigation-mobil {
        display:flex;        
    }
   
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 100px;
        padding:0 1.5em 0 1.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: auto;
        font-size:2.2em;
        letter-spacing: 2px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 0%;
        font-size:0;        
        display:none;
    }
    header > div:nth-of-type(2) {
        margin: 0.5em 1em 1em 1em;
        font-size:1em;
    }
    .is-open {        
        font-size:1em !important;
    }
}
@media screen and (min-width: 641px) and (max-width: 800px) {
    body { font-size:16px; }
    nav.navigation-mobil {
        display:flex;  
    }
    
    header {
        margin-top: 1em;
    }
    
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 120px;        
        padding:0 1.5em 0 1.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: 74%;
        font-size:2.9em;
        letter-spacing: 2px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 18%;
        font-size:1.5em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(2) {
        margin: 1em 1em 1em 1em;
        font-size:1.1em;
    }
    .is-open {        
        font-size:1em !important;
    }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
    body { font-size:16px; }
    nav.navigation-mobil {
        display:flex;  
    }
    
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 130px;
        padding:0 1.5em 0 2em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: 65%;
        font-size:3.5em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        font-size:1.8em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(2) {
        margin: 1em .5em 1em .5em;
        font-size:1.3em;
    }
    .is-open {        
        font-size:1em !important;
    }
}
@media screen and (min-width: 1025px) and (max-width: 1152px) {    
    body { font-size:20px;}
    nav.navigation-mobil {
        display:flex;  
    }
    
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 150px;
        padding:0 1.5em 0 2.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: 65%;
        font-size:3.5em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 27%;
        font-size:1.8em;
        letter-spacing: 3px;
    }
    .is-open {        
        font-size:1em !important;
    }
}
@media screen and (min-width: 1153px) and (max-width: 1280px) {    
    body { font-size:20px;}
    nav.navigation-mobil {
       display:flex;  
    }
    
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 150px;
        padding:0 1.5em 0 2.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: 60%;
        font-size:3.5em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 27%;
        font-size:1.8em;
        letter-spacing: 3px;
    }
    .is-open {        
        font-size:1em !important;
    }
}
@media screen and (min-width: 1281px) {   
    body { font-size:20px; max-width:1400px; margin:auto; }
    nav.navigation-mobil {
        display:flex;        
    }
   
    header > div:nth-of-type(1) > div:nth-of-type(1) {
        flex-basis: 160px;
        padding:0 1.5em 0 2.5em;
    }
    header > div:nth-of-type(1) > div:nth-of-type(2) {
        flex-basis: 65%;
        font-size:3.5em;
        letter-spacing: 3px;
    }
    header > div:nth-of-type(1) > div:nth-of-type(3) {
        flex-basis: 27%;
        font-size:1.8em;
        letter-spacing: 3px;
    }
    .is-open {        
        font-size:1em !important;
    }
}

@media screen and (max-width: 360px) {
    .w-100 {width:100%} .w-95 {width:98%} .w-90 {width:95%} .w-80 {width:95%}  .w-70 {width:95%}  .w-60 {width:95%} .w-50 {width:95%} .w-40 {width:95%} .w-30 {width:95%}
}
@media screen and (min-width: 361px) and (max-width: 480px) {
    .w-100 {width:100%} .w-95 {width:98%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:80%}  .w-60 {width:80%} .w-50 {width:85%} .w-40 {width:85%} .w-30 {width:80%}
}
@media screen and (min-width: 481px) and (max-width: 640px) {
    .w-100 {width:100%} .w-95 {width:98%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:80%}  .w-60 {width:80%} .w-50 {width:80%} .w-40 {width:43%} .w-30 {width:40%}
}
@media screen and (min-width: 641px) and (max-width: 800px) {
    .w-100 {width:100%} .w-95 {width:95%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:70%}  .w-60 {width:60%} .w-50 {width:50%} .w-40 {width:44%} .w-30 {width:40%}
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
    .w-100 {width:100%} .w-95 {width:95%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:70%}  .w-60 {width:60%} .w-50 {width:50%} .w-40 {width:45%} .w-30 {width:40%}
}
@media screen and (min-width: 1025px) and (max-width: 1152px) {
    .w-100 {width:100%} .w-95 {width:95%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:70%}  .w-60 {width:60%} .w-50 {width:50%} .w-40 {width:40%} .w-30 {width:30%}
}
@media screen and (min-width: 1153px) and (max-width: 1280px) {    
    .w-100 {width:100%} .w-95 {width:95%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:70%}  .w-60 {width:60%} .w-50 {width:50%} .w-40 {width:40%} .w-30 {width:30%}
}
@media screen and (min-width: 1281px) {   
    .w-100 {width:100%} .w-95 {width:95%} .w-90 {width:90%} .w-80 {width:80%}  .w-70 {width:70%}  .w-60 {width:60%} .w-50 {width:50%} .w-40 {width:40%} .w-30 {width:30%}
}