@media only screen and (max-width: 1253px) {
    body.StartPage .wrapper   {
        /*background-color:  rgba(255, 255, 255, 0.6);*/  
    }   


    body.StartPage .maintextcontainer h1 {
        font-size: 26px;
    }
    body.StartPage .maintextcontainer h2 { 
        font-size: 19px;

    }
    body.StartPage .maintextcontainer h3 { 
        font-size: 15px;

    }


}



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

    header { cursor: default;}
    /*#footer {display: none!important}*/
    body#id1 div#footer .footercol {width: 100%}
    #footer {
        background-image: none;  
        height:80px;
        background-color: #3E7D86
    }
    .footercol {padding-top:20px!important}


    .typography h2.BigpageTitle  {
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 15px;
        padding: 10px;
    }

    #MultiImages {
        margin-left: 10px;
        max-width: 82%;
        padding-bottom: 20px;
        position: relative;
    }



    .nav-bg {
        background-position:  left -200px;
    }

    body.StartPage .wrapper   {
        background-color:  rgba(255, 255, 255, 0.8);  

    } 
    body.StartPage .maintextcontainer {
        margin: 0 0 0 40px;
        max-width: 800px;
    }

    body.StartPage .maintextcontainer h1 {
        font-size: 29px;
    }
    body.StartPage .maintextcontainer h2 { 
        font-size: 19px;

    }
    body.StartPage .maintextcontainer h3 { 
        font-size: 16px;

    }


    .wrapper {
        position: relative;
    }

    [role="main"] {
        margin-left: 0px;
    }
    .nav-bg {
        /*background: #273646;*/
        width: 240px;
        height: 100%;
        position: fixed;
        z-index: 5;
        top: 0;
        left: -240px;
    }

    .nav-open .nav-bg {
        /*overflow-y: auto;*/
    }
    .nav-open .nav-bg {
        padding-top: 10px;
    }

    #nav-toggle {
        background-image: url("data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%0A%3C%21--%20Generated%20by%20IcoMoon.io%20--%3E%0A%3C%21DOCTYPE%20svg%20PUBLIC%20%22-//W3C//DTD%20SVG%201.1//EN%22%20%22http%3A//www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd%22%3E%0A%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20width%3D%2221%22%20height%3D%2224%22%20viewBox%3D%220%200%2021%2024%22%3E%0A%09%3Cpath%20d%3D%22M20.571%2018v1.714q0%200.348-0.254%200.603t-0.603%200.254h-18.857q-0.348%200-0.603-0.254t-0.254-0.603v-1.714q0-0.348%200.254-0.603t0.603-0.254h18.857q0.348%200%200.603%200.254t0.254%200.603zM20.571%2011.143v1.714q0%200.348-0.254%200.603t-0.603%200.254h-18.857q-0.348%200-0.603-0.254t-0.254-0.603v-1.714q0-0.348%200.254-0.603t0.603-0.254h18.857q0.348%200%200.603%200.254t0.254%200.603zM20.571%204.286v1.714q0%200.348-0.254%200.603t-0.603%200.254h-18.857q-0.348%200-0.603-0.254t-0.254-0.603v-1.714q0-0.348%200.254-0.603t0.603-0.254h18.857q0.348%200%200.603%200.254t0.254%200.603z%22%20fill%3D%22%23ffffff%22%20/%3E%0A%3C/svg%3E%0A");
        background-color: #F8AF53;
        background-repeat: no-repeat;
        background-size: 24px 24px;
        display: block;
        width: 22px;
        height: 24px;
        text-indent: -9999em;
        border: none;
        outline: none;
        position: absolute;
        top: 1px;
        left: 10px;
        cursor: pointer;
        padding-left:9px
    }

    .no-svg #nav-toggle {
        background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAYCAYAAAAVibZIAAAAeElEQVQ4jeXUoRGDYBBE4SsnBUSkgEgKiECmiDjKQCAoA4GgjIgICon4ELRw/5zgzazduZs3sxHXBj3mpIy4Bf5ymSK5EOZwnr0n5YdXtdJq8MGWlAWPZvablA7y3l/xrFZajXNZ9qR80TWz32T63vJGesK9WmkxB8ZGxb+28pBAAAAAAElFTkSuQmCC");
        background-repeat: no-repeat;
    }

    nav ul {
        text-align: left;
    }
    nav li {
        display: block;
    }
    nav li a {
        /*        color: white;
                background: #2c3e50;
                display: block;
                font-size: 16px;
                text-transform: uppercase;
                text-decoration: none;
                padding: 10px 13px;
                border-top: 1px solid #34495e;
                border-bottom: 1px solid #273646;*/
    }
    nav li a:hover {
        /*background: #34495e;*/
    }
    nav li:first-child a {
        border-top: none;
    }

    @-webkit-keyframes slideOpen {
        from {
            -webkit-transform: translateX(0);
        }

        to {
            -webkit-transform: translateX(240px);
        }
    }

    @-moz-keyframes slideOpen {
        from {
            -moz-transform: translateX(0);
        }

        to {
            -moz-transform: translateX(240px);
        }
    }

    @-o-keyframes slideOpen {
        from {
            -o-transform: translateX(0);
        }

        to {
            -o-transform: translateX(240px);
        }
    }

    @keyframes slideOpen {
        from {
            transform: translateX(0);
        }

        to {
            transform: translateX(240px);
        }
    }

    @-webkit-keyframes slideClosed {
        from {
            -webkit-transform: translateX(240px);
        }

        to {
            -webkit-transform: translateX(0);
        }
    }

    @-moz-keyframes slideClosed {
        from {
            -moz-transform: translateX(240px);
        }

        to {
            -moz-transform: translateX(0);
        }
    }

    @-o-keyframes slideClosed {
        from {
            -o-transform: translateX(240px);
        }

        to {
            -o-transform: translateX(0);
        }
    }

    @keyframes slideClosed {
        from {
            transform: translateX(240px);
        }

        to {
            transform: translateX(0);
        }
    }

    .nav-open .wrapper {
        -webkit-animation-name: slideOpen;
        -moz-animation-name: slideOpen;
        animation-name: slideOpen;
        -webkit-animation-duration: 0.3s;
        -moz-animation-duration: 0.3s;
        animation-duration: 0.3s;
        -webkit-animation-timing-function: ease-out;
        -moz-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }

    .wrapper {
        -webkit-animation-name: slideClosed;
        -moz-animation-name: slideClosed;
        animation-name: slideClosed;
        -webkit-animation-duration: 0.2s;
        -moz-animation-duration: 0.2s;
        animation-duration: 0.2s;
        -webkit-animation-timing-function: ease-in;
        -moz-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -o-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .loading .wrapper {
        -webkit-animation: none;
        -moz-animation: none;
        animation: none;
    }

    .overlay {
        content: '';
        display: none;
        width: 100%;
        height: 100%;
        position: fixed;
        z-index: 5;
        top: 0;
        left: 0;
    }

    .nav-open .overlay {
        display: block;
    }
    header {
        background: url("../images/logo1.png") no-repeat scroll 50px 10px / 90px 47px rgba(0, 0, 0, 0);
        height: 65px;
        left: 20px;
        position: static;
        text-indent: -9999px;
        width: 350px;
        z-index: 999;
    }

    #roslagen {
        padding-top: 10px;
        width: 120px;
        position: absolute;
        top:10px;
    }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) and (min-width: 0 \0) {
    .nav-open .nav-bg {
        left: 0;
    }

    .wrapper,
    .nav-open .wrapper {
        -webkit-animation: none;
        -moz-animation: none;
        animation: none;
    }

    .nav-open .wrapper {
        -webkit-transform: translateX(240px);
        -moz-transform: translateX(240px);
        -ms-transform: translateX(240px);
        -o-transform: translateX(240px);
        transform: translateX(240px);
    }

    .wrapper {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }


}


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

    /*#footer {display: none!important}*/

    #footer {
        background-image: none;  
        height:80px;
        background: rgba(25,25,25,0.8)
    }
    .footercol {padding-top:20px!important}

    #MultiImages {
        margin-left: 10px;
        max-width: 82%;
        padding-bottom: 20px;
        position: relative;
    }
}

@media only screen and (max-height: 500px)   { 

    /*body.StartPage .maintextcontainer   {*/
    body.StartPage .wrapper   {
        background-color:  rgba(255, 255, 255, 0.8);  
    } 

    body.StartPage .maintextcontainer   {
        /*        background-color:  rgba(255, 255, 255, 0.8);*/
        /*margin:0px;*/
        /*padding: 50px 100px;*/
    }

    /*#footer {display: none!important}*/ 
    #footer {
        display: none!important;
        position: static;
        background-image: none;  
        height:auto;
        padding-bottom: 50px;
        /*min-height: 250px;*/
        /*background-color: #3E7D86*/
        background-color: rgba(255, 255, 255, 0.8);
        background-color: transparent;
    }
    .footercol {padding-top:20px!important;padding-bottom: 20px;color:#000!important}

}

/*@media only screen and (max-width: 400px)   { 
 
    body.StartPage .maintextcontainer   {
   
     
    body.StartPage .maintextcontainer   {
        background-color:  rgba(255, 255, 255, 0.8);
        margin:0px;
        padding: 50px 100px;
    }

    #footer {display: none!important} 
}*/


@media only screen and (max-width: 653px) {
    #MultiImages {
        margin-left: 10px;
        max-width: 82%;
        padding-bottom: 20px;
        position: relative;
        float: none
    }
}

@media only screen and (max-height: 360px)   { 
    #footer {position:static;background-color: transparent;}
    .footercol {color:#000!important}
    .main2 {height: auto!important}
}