div.menu.mobile{
        display:none!important;
        position:absolute;
        top:15px;
        width:50px;
        right:0px!important;
        vertical-align:middle;
        text-align:center;
        cursor:pointer;
        line-height:80%;
    }
    
    nav{ top:0; }
    
    nav div.content{ width:100%; }
    
    
    div.menu.mobile i.fa{ 
        font-size:42px;
        color:#3C3C3B;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
    }
    div.menu.mobile a{ 
        color:#3C3C3B; font-family:'TradeGothicNextW01-Bold_693232';  text-transform: uppercase; font-size:14px;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
    }

    div.menu.mobile:hover a,div.menu.mobile:hover i.fa{
        color:#124395;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
    }

    nav div.menu-otsikko{
        display:none;
        text-align:left;
        font-family:'LeituraW01-DisplayRoman';
        font-size:28px; 
        color:#3C3C3B;
        padding:22px;
    }    

    div.menu-verho{
        display:none;
        top:0;
        width:100%;
        height:100%;
        position:fixed;
        z-index:2501;
        background:rgba(0,0,0,0.8);
    }

    nav div.sulje-menu{ 
        display:none;
        position:absolute;
        right:20px;
        top:17px;
    }
    
    nav div.sulje-menu i.fa{
        font-size:32px; 
        color:#3C3C3B; 
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
    }

    nav div.sulje-menu:hover i.fa{
        font-size:32px; 
        color:#124395; 
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
    }
    
    nav ul li span.fa{ 
        display:none!important;
        /* border-left:1px solid white; */
        float:right; 
        width:15%; 
        height:50px; 
        text-align:center; 
        line-height:50px!important; 
        vertical-align:middle; 
        font-size:28px!important;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;   
        cursor:pointer;      
    }
    
    nav ul li span:hover, nav ul li.valittu span, nav ul li.klikattu span{ 
        color:white; 
        background:#124395;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;
         
    }

    nav div.linkitys{ display:block; position:relative; }
    nav ul.alilinkitys{ display:none; margin-top:0; padding-top:0; min-width:100%; }


@media only screen and (max-width: 1210px) {
    nav div.col-9{ width:80%; padding-left:0!important; }
    nav div.col-3{ width:20%; }
    nav div.logo img{ height:auto; max-height:none}    
    nav ul li{ padding:0 8px; }
}

@media only screen and (max-width: 1024px) {
    nav{ z-index:1111; border-bottom:1px solid rgb(204,204,204); height:90px; }
    nav div.content{  position:relative; }
    nav div.logo{ float:left; line-height:80px; text-align:left; width:50%; }
    nav div.logo img{ height:80px; }

    nav div.linkitys{ position:fixed; top:0px; width:360px!important; max-width:100%!important; right:-360px; background:white; z-index:999999!important; height:100%; /* box-shadow:0px 0px 8px #355AA6; */ overflow: auto; margin:0!important; padding:0!important;  }


    nav div.sulje-menu{ display:block; }
    nav ul.paalinkitys{ padding:0; margin-top:20px; float:left; border-top:1px solid rgb(204,204,204); }
    nav ul.paalinkitys li{ width:100%!important; display:list-item!important; padding:0!important; float:left; border:none; line-height:50px; text-align:left; margin:0!important; border-bottom:1px solid rgb(204,204,204); }
    
    nav ul.paalinkitys{padding-left:0!important; padding-right:0!important; }
    nav ul.paalinkitys li a{
        float:left; width:100%; padding-left:25px; 
    }
    nav ul.paalinkitys li.alilinkkeja a{ width:85%;}
    
    nav ul.paalinkitys li.alilinkkeja span{ display:block!important; border-left:1px solid rgb(204,204,204); font-size:16px!important; }
    
    nav ul.alilinkitys li a{ text-transform: none; width:100%!important;}


    nav ul li a{ 
        display:block;
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;
 
    }
    nav ul li a:hover, nav ul li a.valittu, nav ul li.klikattu a, nav ul li.muu-klikattu span:hover{ 
        background: #124395; 
        color:white; 
        -webkit-transition:0.5s;
        -moz-transition: 0.5s;                 
        -o-transition: 0.5s;   
        -ms-transition: 0.5s; 
        transition:0.5s;
    }

    nav ul.alilinkitys{ display:block!important; float:left!important; padding:0!important; margin:0!important; background:rgb(245,245,245); border-top:1px solid rgb(204,204,204); border-bottom:none!important; }
    nav ul.paalinkitys li.valittu ul.alilinkitys{ display:block; }
    
    nav ul.alilinkitys li{ width:100%; float:left!important; border:none!important; }
    nav ul.alilinkitys li a{ width:100%; display:block; font-size:15px; padding:0 25px!important; font-family:'Trade Gothic Next W01'; border:none!important; }

    div.menu.mobile, div.menu-otsikko{ display:block!important;  }
    div.menu.etusivu{ display:none!important; }
}

@media only screen and (max-width: 860px) {
    div.menu.mobile{ right:10px; }
    nav div.logo{ margin-left:20px; }    
}

@media only screen and (max-width: 768px) and (orientation:landscape) {
}

@media only screen and (max-width: 360px) {
    nav ul.paalinkitys li a{ font-size:18px; padding-left:15px;  }
    /*
    nav div.linkitys{ width:200%!important; }
    nav div.paalinkitys, nav div.alilinkitys{ width:50%!important; }
    */
}