*{
                margin: 0;
                padding: 0;
            }
            
            body{
                background-color: white;
                font-family: lato, arial, verdana, sans-serif;
                font-weight: 300;
                font-size: 14px;
                letter-spacing: 0.7px;
                line-height: 20px;
            }
            
            p{
                margin-top: 20px;
                margin-bottom: 20px;
            }
            
            em{
                font-size: 105%;
                font-style: italic;
            }
            
            .clearfix{
                clear: both;
            }
            
            .lato400{
                font-weight: 400;
                display: inline;
            }
    
    /*wrapper*/
            
            #wrapper{
                width: 900px;
                height: auto;
                margin: 0 auto;
                position: relative;
            }
            
    /*header*/
            
            header{
                height: 90px;
                padding: 15px;
                padding-left: 20px;    
            }
                header h1{
                    font-family: archivo black, arial black, arial, verdana, sans-serif;
                    font-size: 40px;
                    text-transform: uppercase;
                    letter-spacing: 2px;
                    line-height: normal;
                }
                
                header h2{
                    font-weight: 300;
                    font-size: 15px;
                    text-transform: uppercase;
                    letter-spacing: 2px;
                    line-height: normal;  
                }
                
            /*logo with animation*/
                
                .logo{
                    height: 80px;
                    width: 80px;
                    background-image: url(graphics/telstar.gif);
                    background-repeat: no-repeat;
                    background-size: cover;
                    position: absolute;
                    top: 18px;
                    left: 350px;
                    /*animation*/
                    animation:logo 15s linear 1s;
                    /* animation safari and chrome: */
                    -webkit-animation:myfirst 10s linear 2s;
                }
                header a{
                    color: black;
                    text-decoration: none;
                }
            
                header a:hover{
                    text-decoration: none;
                }
                
    /*aside*/
            
            aside{
                /*height: 600px;*/
                width: 180px;
                /*border-right: dotted 1px black;*/
                padding: 20px;
                padding-top: 0px;
                float: left;
            }
                
                nav ul {
                list-style-type: none;
                padding: 0;
                margin: 0;
                width: 160px;
                }
                
                nav a {
                text-decoration: none;
                text-transform: normal;
                display: block;
                padding: 3px 12px 3px 8px;
                /*background-color: #666;
                color: #fff;
                border: 1px solid #ddd;*/
                color: black;
                }
                
                nav a:hover {
                color: #b8b8b8;
                }
                
                nav a:active {
                padding: 2px 13px 4px 7px;
                /*background-color: #444;
                color: #eee;
                border: 1px solid #333;*/
                color: #b8b8b8;
                }

                nav li li a {
                text-decoration: none;
                padding: 3px 3px 3px 36px;
                /*background-color: #999;
                color: #111111;*/
                }
                
                nav li li a:hover {
                color: #b8b8b8;
                }
                
                nav li li a:active {
                padding: 2px 4px 4px 35px;
                /*background-color: #888;
                color: #000;
                font-weight: bold;*/
                color: #b8b8b8;
                }
                
                .contact{
                    text-transform: uppercase;
                }
                
        /*aside dotted line*/
        
                .dotted_line{
                height: 1px;
                border-bottom: dotted 1px black;   
                }
        
                .dotted_line_end{
                height: 1px;
                border-bottom: dotted 1px black;
                margin-top: 20px;    
                }
                
    /*section*/
            
            section{
                /*height: 600px;*/
                width: 540px;
                border: dotted 1px black;
                float: right;
                padding: 24px;
                float: left;
                /*margin-top: 9px*/
                margin-left: 40px;
                position: relative;
            }
                
                section ul{
                    margin-top: 15px;
                    margin-right: 50px;
                    margin-left: 50px;
                }
                
                section a{
                    font-weight: 400;
                    color: #303030;
                    text-decoration: none;
                }
            
                section a:hover{
                    font-weight: 400;
                    color: #b8b8b8;
                    text-decoration: none;
                }
            
                section a:active{
                    font-weight: 400;
                    color: #b8b8b8;
                    text-decoration: none;                    
                }
                
                section blockquote{
                    font-style: italic; 
                    margin-left: 50px;
                    margin-right: 50px;
                }
                
                section .blockquote_source{
                margin-left: 50px; 
                }
                
                section h3{
                    /*font-weight: 300;*/
                    font-size: 105%;
                    /*text-transform: uppercase;
                    letter-spacing: 2px;
                    line-height: normal;*/
                    font-weight: bold;
                }
                
                section h4{
                    /*font-weight: 300;
                    font-size: 15px;
                    text-transform: uppercase;
                    letter-spacing: 2px;
                    line-height: normal;*/
                    font-weight: bold;
                }
                
                section .terusutaa{
                    font-size: 12px;
                }
                
        
            /*section dotted line*/
        
                section .dotted_line{
                height: 1px;
                border-bottom: dotted 1px black;   
                }
        
                section .dotted_line_end{
                height: 1px;
                border-bottom: dotted 1px black;
                margin-top: 20px;    
                }
                
    /*anchor menu*/
            .anchor_menu{
                widht: 200px;
                height: auto;
                /*margin-left: 400px;*/
                border-left: dotted 1px black;
                padding: 0px;
                position: relative;
                top: -35px;
                left: 400px;
            }
                .anchor_menu lu{
                    margin: 0px;
                    padding: 0px;
                }
                .anchor_menu li{
                    margin: 0px;
                    list-style-type: none;
                    padding: 0px;
                }
                
                
                .anchor_menu a{
                    color: #303030;
                    font-weight: 300;
                    text-decoration: none;
                }
            
                .anchor_menu a:hover{
                    color: #b8b8b8;
                    text-decoration: none;
                }
        
    /*alba-archives fonts*/
            .alba{
                font-family: open sans condensed, times new roman, serif;
                font-weight: 300;
                font-size: 18px;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        
            .vita_faglar{
                font-family: crimson text, times new roman, serif;
                font-weight: 400;
                font-size: 17px;
            }
        
            .samlingen{
                font-family: eb garamond, times new roman, serif;
                font-weight: 400;
                font-size: 15px;
                text-transform: uppercase;
            }
        
            .sightings{
                font-family: archivo narrow, arial, verdana, sans-serif;
                font-weight: 400;
                font-size: 15px;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        
            .snoe{
                font-family: lato, arial, verdana, sans-serif;
                font-weight: 300;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        
            .snapshots{
                font-family: lato, arial, verdana, sans-serif;
                font-weight: 400;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        
            .ultrachrome{
                font-family: libre baskerville, times new roman, serif;
                font-weight: 400;
                font-size: 14px;
            }
        
            .polyachrome{
                font-family: lato, arial, verdana, sans-serif;
                font-weight: 700;
                text-transform: uppercase;
                letter-spacing: 1px;
            }
        
    /*images*/
    
        /*telstar*/
            .telstar{
                height: 120px;
                width: 125px;
                background-image: url(terusutaa/telstar_125x120px.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                float:left;
                margin-right: 3px;
            }
            /*flag*/
            .flag{
                height: 120px;
                width: 125px;
                background-image: url(terusutaa/flag_125x120px.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                float:left;
                margin-right: -5px;
            }
            /*day in history*/
            .day{
                height: 120px;
                width: 158px;
                background-image: url(terusutaa/day_158x120px.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                float:left;
                margin-right:3px;
            }
            /*ignition*/
            .ignition{
                height: 120px;
                width: 125px;
                background-image: url(terusutaa/ignition_125x120px.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                float:left;
                margin-right:3px;
            }
            /*scheme*/
            .scheme{
                height: 120px;
                width: 125px;
                background-image: url(terusutaa/scheme_125x120px.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                float:left;
                margin-right:3px;
            }
        
        /*alba archives*/
            .albatross{
                height: 100px;
                width: 100px;
                background-image: url(alba_archives/diomedea_exulans.png);
                background-size: contain;
                background-repeat: no-repeat;
                position: absolute;
                top: 20px;
                left: 300px;
            }
            
            .konstfack{
                height: 188px;
                width: 250px;
                background-image: url(alba_archives/konstfack.jpg);
                background-size: contain;
                margin-top: 30px;
                background-repeat: no-repeat;
                margin-left: -5px;
                margin-right: 5px;
                float: left;
            }
            .islands_brygge{
                height: 188px;
                width: 141px;
                background-image: url(alba_archives/islands_brygge.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-top: 30px;
                margin-right: 5px;
                float: left;
            }
            .haernestad{
                height: 188px;
                width: 141px;
                background-image: url(alba_archives/haernestad.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-top: 30px;
                margin-right: 0px;
                float: left;
            }
        /*vita 1*/
            .white_tern{
                height: 120px;
                width: 150px;
                background-image: url(vita_faglar/gygis_alba_fish_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
            .snowy_owl{
                height: 100px;
                width: 100px;
                background-image: url(vita_faglar/bubos_scandiacus_sitting_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
            .snow_ptarmigan{
                height: 100px;
                width: 90px;
                background-image: url(vita_faglar/lagopus_lagopus_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
            .siberian_crane{
                height: 150px;
                width: 120px;
                background-image: url(vita_faglar/grus_copy_cmyk_plus.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
        /*vita 2*/
            .white_tern_2{
                height: 120px;
                width: 150px;
                background-image: url(vita_faglar/gygis_alba_fish_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: right;
            }
            .snowy_owl_2{
                height: 120px;
                width: 120px;
                background-image: url(vita_faglar/bubos_scandiacus_sitting_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
            .snow_ptarmigan_2{
                height: 120px;
                width: 120px;
                background-image: url(vita_faglar/lagopus_lagopus_copy_cmyk.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
            .siberian_crane_2{
                height: 150px;
                width: 120px;
                background-image: url(vita_faglar/grus_copy_cmyk_plus.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-right: 20px;
                float: left;
            }
        /*plakat*/
            .vita_faglar_plakat{
                height: 700px;
                width: 500px;
                background-image: url(vita_faglar/dsc0041_copy2plus.jpg);
                background-size: contain;
                background-repeat: no-repeat;
                margin-top: 50px;
                margin-left: 20px;
            }
        
        
    /*keyframes*/
            @keyframes logo{
                0%   {left:350px; top:18px;}
                9%   {left:380px; top:18px;}
                12%  {left:380px; top:18px;}
                26%  {left:310px; top:18px;}
                58%  {left:255px; top:18px;}
                60%  {left:255px; top:18px;}
                92%  {left:350px; top:18px;}
                98%  {left:350px; top:18px;}
                99%  {left:350px; top:17px;}
                100% {left:350px; top:18px;}
            }

    /* keyframes safari and chrome */
            @-webkit-keyframes logo{
                0%   {left:350px; top:18px;}
                9%   {left:380px; top:18px;}
                12%  {left:380px; top:18px;}
                26%  {left:310px; top:18px;}
                58%  {left:255px; top:18px;}
                60%  {left:255px; top:18px;}
                92%  {left:350px; top:18px;}
                98%  {left:350px; top:18px;}
                99%  {left:350px; top:17px;}
                100% {left:350px; top:18px;}
            }