/* ---------------------------------------------------------
   ---------------------------------------------------------*/
    @font-face {
      font-family: 'Source Sans Pro', sans-serif;
    }
    
    /* Default link styling */
    a:link { color:#000; }
    a:visited { color:#000; }
    a:hover, a:focus { color:#000; }
    a:active { color:#000; }
    a {text-decoration:none; font-weight: bold;}
    

/* ---------------------------------------------------------
   Styles
   ---------------------------------------------------------*/


    body {
      font-size: 14px;
      font-family: Source Sans Pro, Sans-Serif;
     
    }
    
    
    h1, h2 {
      font-weight: bold;
      font-family: Source Sans Pro;
      padding: 0;
      margin: 0;
    }
    
    #header {
      padding-top: 45px;
     }

    
    #wrapper {
      max-width: 960px;
      margin: 0 auto;
      padding-left: 10px;
      padding-right: 10px;
    }

    #flex-wrap {
      display: flex;
      width: 100%;
     }
     
     #right {
       width: 330px;
     }

     #left {
       flex: 1;
     }

    #header,
    footer {
      max-width: 960px;
      margin: 0 auto;
      clear: both;
      }
    
    
    #logo {
      float: left;
      position: relative;
      top: 0;
      left: 0;
      padding-bottom: 45px;
    }

    #contact {
      float: right;
      max-width: 330px;
      position: relative;
    }
    
    #pensions {
      padding-bottom: 26px;
      text-align: right;
      
    }
    #email {
      position: relative;
      bottom: 0;
      left: 0;
    }
    
    hr {
      color: 1px solid #5f5c5d;
      margin-bottom: 35px;
      clear: both;
    }
    
    h1 { font-size: 20px; vertical-align: top;}  
    
    main {
      max-width: auto;
      float: left;
      padding-right: 10px;
    }
    
    main a {
      font-weight: 700;
      font-family: Source Sans Pro, Sans-Serif;
    }
    ul {
      list-style-type: none;
      padding: 0;
      margin: 0;
      padding-top: 10px;
    }
    li {
      height: 28px;
      font-family: Source Sans Pro, Sans-Serif;
      font-weight: light;
    }
    
    .docs {
      padding-bottom: 34px;
    }
    
    footer {
      background-color: #432df2;
      color: white;
      font-size: 14px;
      width: 100%;
    }
    footer p {
      padding: 20px;
      line-height: 1.5em;
    }
    
/* ---------------------------------------------------------
   Responsive
   ---------------------------------------------------------*/
    @media only screen and (max-width: 768px) {
  /* For mobile phones: */
  
  main {
    width: 100%;
  }
  #flex-wrap {
      display: block;
      width: 100%;
     }
     
     #right {
       width: 100%;
     }

     #left {
       width: 100%;
     }
  #logo,
  #pensions,
  #email,
  #contact {
    float: left;
    clear: both;
    margin: 0;
    padding: 0;
    padding-top: 10px;
    text-align: left;
  
  }
  #email { padding-bottom: 10px; }
  .docs { 
    padding-bottom: 10px; }
}  
/* ---------------------------------------------------------
   Print styles
   ---------------------------------------------------------*/
@media print {
    * {
        color:#000 !important;
        box-shadow:none !important;
        text-shadow:none !important;
        background:transparent !important;
    }
    html { background-color:#fff; }
    /* Hide navigation */
    nav { display:none; }

    /* Show link destinations in brackets after the link text */
    a[href]:after { content: " (" attr(href) ") "; }
    a[href] {
        font-weight:bold;
        text-decoration:none;
        color:#06c;
        border:none;
    }
    /* Don't show link destinations for JavaScript or internal links */ 
    a[href^="javascript:"]:after, a[href^="#"]:after { content:""; }
    
    /* Show abbr title value in brackets after the text */
    abbr[title]:after { content: " (" attr(title) ")"; }

    figure { 
        margin-bottom:1em; 
        overflow:hidden;
    }

    figure img { border:1px solid #000; }
}