a:link,html {
    color: #414042
}

html {
    height: 100%;
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    font-size: 12px
}

a:link {
    text-decoration: none
}

body,ul.topnav {
    margin: 0;
    padding: 0
}

body {
    height: 102%
}

.chart,body {
    width: 100%
}

@font-face {
    font-family:'Roboto';src:url(../font/Roboto-Bold.eot);src:url(../font/Roboto-Bold.eot?#iefix) format('eot'),url(../font/Roboto-Bold.woff) format('woff'),url(../font/Roboto-Bold.ttf) format('truetype'),url(../font/Roboto-Bold.svg) format('svg');font-weight:700;font-style:normal;
}

@font-face {
    font-family:'Futura';src:url(../font/FuturaStd-Light.eot);src:url(../font/FuturaStd-Light.?#iefix) format('eot'),url(../font/FuturaStd-Light.woff) format('woff'),url(../font/FuturaStd-Light.ttf) format('truetype'),url(../font/FuturaStd-Light.svg) format('svg');font-weight:400;font-style:normal;
}

* {
    box-sizing: border-box
}

.main_container {
    margin-left: 8.33%;
    width: 87.495%;
    height: auto;
    float: left
}

.header-wrapper {
    margin-top: 3%;
    position: relative;
    padding-bottom: 5.5%;
    height: 0
}

.header {
    position: absolute;
    top: 0;
    left: 0;
    width: 96.3%;
    height: 100%;
    float: left
}

.koskinen {
          width: 43.32%;
          float: left 
}
.slash {
       width: 3.82%;
       float: left;
}
.foi {
     width: 52.86%;
     float: left;

}
.studio {
         width: 92.5%;
         float: left
}

.logo{
  padding-top: 3%;
    display: block;
    margin: 0 auto
}


img.blend:hover {
      filter: alpha(opacity=75);
      opacity: .75
}


.HKW:hover,.SVG:hover,div.menu-img:hover {
    filter: alpha(opacity=75);
    opacity: .75
}



.header_2-wrapper {
    margin-top: 2%;
    position: relative;
    padding-bottom: 3%;
    height: 0;
    margin-bottom: 5%;
    width: 103%
}

.header_2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 93%;
    max-width: 93%;
    height: 100%;
    float: left;
    margin-right: 1%
}

.navibar {
    width: 95.85%;
    height: auto;
    padding: 0;
    float: left;
    margin-bottom: .5%;
    margin-top: 1%
}

ul.topnav {
    list-style-type: none;
    overflow: hidden;
    background-color: #fff
}

ul.topnav li,ul.topnav li a {
    display: block;
    text-align: left
}

ul.topnav li {
    width: 18%;
    float: left
}

ul.topnav li1 {
    width: 8%;
    float: left;
    display: block;
    text-align: center
}

ul.topnav li2,ul.topnav li3,ul.topnav li4,ul.topnav li5 {
    width: 11%;
    float: left;
    display: block;
    text-align: center
}

ul.topnav li3,ul.topnav li4,ul.topnav li5 {
    width: 17%
}

ul.topnav li4,ul.topnav li5 {
    width: 20%
}

ul.topnav li5 {
    width: 10%
}

ul.topnav li6 {
    width: 15%;
    float: right;
    display: block;
    text-align: right
}

ul.topnav li a {
    color: #000;
    padding-bottom: 10px;
    font-size: 12px;
    text-decoration: none
}

ul.topnav li1 a,ul.topnav li2 a,ul.topnav li3 a,ul.topnav li4 a,ul.topnav li5 a,ul.topnav li6 a {
    display: block;
    color: #000;
    text-align: center;
    padding-bottom: 10px;
    font-size: 12px;
    text-decoration: none
}

ul.topnav li6 a {
    text-align: right
}

a:hover:not(.active) {
    color: #888
}

.HKW,.footer {
    width: 95.85%;
    float: left
}

.footer {
    margin-bottom: 4%;
    padding-top: 2%;
    text-align: center;
    font-size: 11px;
    height: auto;
    margin-top: 1.25%;
    padding-bottom: 2%
}

.HKW {
    margin-top: 3%;
    position: relative;
    padding-bottom: 7%;
    height: 0;
    overflow: hidden;
    border: 1px solid #f2f2f2
}

.col-3 {
    width: 47.925%;
    float: left
}

.no-slides {
    position: relative;
    padding-bottom: 70%;
    float: left;
    border: 1px solid #f2f2f2
}

.col-31,.col-32,.no-slides {
    width: 95.85%;
    height: 0;
    overflow: hidden
}

.col-31 {
    position: relative;
    float: left;
    border: 1px solid #f2f2f2;
    padding-bottom: 80%
}

.col-32 {
    padding-bottom: 75%
}

.col-32,.col-33,.info-wrapper {
    float: left;
    position: relative;
    border: 1px solid #f2f2f2
}

.col-33 {
    height: 0;
    overflow: hidden;
    width: 25%;
    padding-bottom: 37%
}

.info-wrapper {
    padding-bottom: 35.6%;
    width: 95.85%
}

.col-34,.col-35 {
    height: 100%;
    float: left
}

.col-34 {
    position: absolute;
    top: 0;
    max-width: 25%;
    border-right: 1px solid #f2f2f2;
    left: 0;
    width: 25%
}

.col-35 {
    width: 75%;
    bottom: 0;
    left: 25%;
    border-left: 1px solid #f2f2f2;
    font-size: 11px
}

div.pic_text,div.text_pics {
    height: 100%;
    width: 100%;
    margin-bottom: -1%
}

.col-35,div.text_pics img {
    position: absolute
}

div.pic_text img,div.text_pics img {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-bottom: 3%
}

.text,.text_2 {
    display: block;
    position: absolute;
    text-align: left;
    bottom: 8%;
    left: 5%;
    padding-right: 5%;
    padding-left: 0;
    overflow: auto
}

.text_2 {
    bottom: 12%;
    font-size: 10px
}

div.menu-img {
    border: 1px solid #f2f2f2
}

div.menu-img img {
    padding-bottom: 4%;
    float: left
}

#slides .item img,div.menu-img img,div.menu-img2 img {
    width: 100%;
    height: auto
}

.HKW:hover,div.menu-img:hover {
    border: 1px solid #2e2e2e
}

div.menu-text,div.menu-text2 {
    text-align: center;
    padding-left: 2%;
    font-size: 11px
}

div.menu-text {
    padding-top: 2%;
    padding-bottom: 4%
}

div.menu-text2 {
    padding-bottom: 1.5%
}

.HKW:hover,.SVG:hover,div.menu-img:hover {
    filter: alpha(opacity=75);
    opacity: .75
}

.SVG {
    cursor: pointer
}

#slides .item img {
    display: block
}

@media (max-width:290px) {
    .col-3,.text_pics {
        width: 95.85%
    }

    .col-31 {
        padding-bottom: 80%
    }
}

@media only screen and (min-width:600px) {
    div.main {
        padding-left: 8.33%
    }

    .div.menu-img img {
        padding-bottom: 5px
    }

    .col-3,.text_pics {
        width: 32%
    }

    .no-slides {
        padding-bottom: 35%;
        width: 47.925%
    }

    .col-31,.col-32 {
        width: 47.925%;
        padding-bottom: 40%
    }

    .col-34,div.menu-text,div.menu-text2 {
        font-size: 12px
    }

    .text,.text_2 {
        font-size: 11px
    }
}

@media only screen and (min-width:893px) {
    .div.menu-img img {
        padding-bottom: 10px
    }

    .header_2-wrapper {
        margin-bottom: 4%
    }

    .footer,.text,.text_2 {
        font-size: 12px
    }
}

@media (max-width:893px) {
    .hidden-navibar {
        display: none!important
    }
}

@media (max-width:600px) {
    .text {
        position: absolute;
        top: 1%;
        left: 3%;
        padding-bottom: 0%;
        bottom: 0%;
        font-size: 10px
    }
}