@charset "UTF-8";

@font-face {
    font-family: palanquin;
    src: url(/palanquin/palanquin-regular.ttf  );
}

@media all {

    
    


    html, body {
        font-family: palanquin;
        margin: 0;
        padding: 0;
        height: 100%;
        
    }

    body {
        background-image:url('/img/mt_back.jpg');
        background-size: 100% auto;
    }

    .content {
        position: relative;
        margin: auto;
        top: 15%;
        height:70%;
        width: 80%;
        max-width: 1200px;
        min-height:450px;
    }

    .footercontent {
        position: relative;
        margin: auto;
        width: 80%;
        max-width: 1200px;
        top: 5%;
        padding:0.5em;
        background: rgba(200,200,200,0.5);

        
    }

    .footercontent a {
        color: #394864;
        text-decoration: none;
        
    }

    .footercontent a:hover {
        color: #888;
        text-decoration: underline;
        
    }

    a {
        color: #394864;
        text-decoration: none;
        
    }

    a:hover {
        color: #888;
        text-decoration: underline;
        
    }

    .row {
        position: relative;
        width:100%;
 
    }

    .col {
        float:left;
        width: 47%;
        margin-right: 3%;
    }

    
    .col img {
        width: 100%;
    }

    .h1 {
        color: #394864;
        font-size: 40px;
        font-weight: normal;
    }

    .h2 {
        color: #666;
        font-size: 30px;
        font-weight: normal;
    }

    a.h2  {
        color: #394864;
        text-decoration: none;
    }

    a.h2:hover {
        color: #888;
        text-decoration: underline;
    }

    .Imprint {
        color: #666;
        font-size: 15px;
    }


   

    
}

@media screen and (max-width: 1000px) {

    .h1 {
        color: #394864;
        font-size: 30px;
    }

    .h2 {
        color: #666;
        font-size: 20px;
    }
    .footercontent {
        top: 5%;
        
    }

    .content {
        height:60%;
        min-height:300px;
    }


}


@media screen and (max-width: 700px) {

    .content {
        top: 5%;
        width: 90%;
    }

    .col {
        float:left;
        width: 99%;
        margin-right: 1%;
    }
   
    .h1 {
        color: #394864;
        font-size: 30px;
    }

    .h2 {
        color: #666;
        font-size: 20px;
    }

    .footercontent {
        width: 90%;
        top: 5%;
        
    }

    body {
        background-image:url('/img/mt_back.jpg');
        background-size: 100% auto;
        background-repeat: no-repeat;
        background-color: #EEEEEE;
        }
}