a:link {
  text-decoration: none;
}

        body {
            font: 16px Helvetica;
            background: #ffffff;
        }
		
	h1 		{
        font-family: 'Righteous', serif;
        font-size: 48px;
        text-shadow: 4px 4px 4px #aaa;
      }


        #main {
            min-height: 800px;
            margin: 0;
            padding: 0;
            display: flex;
            flex-flow: row;
            width: 100%;
            min-width: 800px;
        }
    
        #main > article {
            margin: 4px;
            padding: 5px;
            border: 1px solid #cccc33;
            border-radius: 7pt;
            background: #ffffff;
            flex: 3 1 70%;
            order: 2;
        }
    
        #main > nav {
            margin: 4px;
            padding: 5px;
            border: 1px solid #5f00ff;
            border-radius: 7pt;
            background: #eeeeee;
            flex: 0 0 15%; /* Fixed width to 25% */
            order: 1;
        }
    
        #main > aside {
            margin: 4px;
            padding: 5px;
            border: 1px solid #5f00ff;
            border-radius: 7pt;
            background: #d7ffff;
            flex: 1 2 15%; /* Adjusted shrink factor */
            order: 3;
        }
    
        header, footer {
            display: block;
            margin: 4px;
            padding: 5px;
            min-height: 100px;
            border: 1px solid #eebb55;
            border-radius: 7pt;
            background: #eeeeee;
        }


 
.post {
    margin-bottom: 30px;
    overflow: hidden; /* Hjälper till att hålla ihop containern */
}

.post h2 {
    width: 100%; /* Rubriken tar upp hela bredden överst */
}

.post-image {
    float: left;        /* Gör att bilden hamnar till vänster och texten flyter runt */
    margin-right: 20px; /* Skapar ett mellanrum mellan bild och text */
    margin-bottom: 10px; /* Avstånd till texten som hamnar under bilden */
    max-width: 300px;   /* Justera efter önskad storlek */
    height: auto;
}

.post p {
    text-align: left;   /* Säkerställer vänsterorientering */
    line-height: 1.6;   /* Gör texten mer lättläst */
}



        /* Responsive Adjustments */
        @media all and (max-width: 640px) {
            #main, #page {
                flex-direction: column;
            }
    
            #main > article, #main > nav, #main > aside {
                order: 0;
            }
    
            #main > nav, #main > aside, header, footer {
                min-height: 50px;
                max-height: 50px;
            }
        }
    
        table { 
            display: table;
            border-collapse: separate;
            border-spacing: 2px;
            border-color: gray;
        }
        
        
        
               body {
            font: 16px Helvetica;
            background: #ffffff;
        }

        #main {
            min-height: 800px;
            margin: 0;
            padding: 0;
            display: flex;
            flex-flow: row;
            width: 100%;
            min-width: 800px;
        }
    
        #main > article {
            margin: 4px;
            padding: 5px;
            border: 1px solid #cccc33;
            border-radius: 7pt;
            background: #ffffff;
            flex: 3 1 70%;
            order: 2;
        }
    
        #main > nav {
            margin: 4px;
            padding: 5px;
            border: 1px solid #5f00ff;
            border-radius: 7pt;
            background: #eeeeee;
            flex: 0 0 15%; /* Fixed width to 25% */
            order: 1;
        }
    
        #main > aside {
            margin: 4px;
            padding: 5px;
            border: 1px solid #5f00ff;
            border-radius: 7pt;
            background: #eeeeee;
            flex: 1 2 15%; /* Adjusted shrink factor */
            order: 3;
        }
    
        header, footer {
            display: block;
            margin: 4px;
            padding: 5px;
            min-height: 100px;
            border: 1px solid #eebb55;
            border-radius: 7pt;
            background: #ffffd7;
        }
    
        /* Responsive Adjustments */
        @media all and (max-width: 640px) {
            #main, #page {
                flex-direction: column;
            }
    
            #main > article, #main > nav, #main > aside {
                order: 0;
            }
    
            #main > nav, #main > aside, header, footer {
                min-height: 50px;
                max-height: 50px;
            }
        }
    
        table { 
            display: table;
            border-collapse: separate;
            border-spacing: 2px;
            border-color: gray;
        }